:root {
	/* Colors */
	--bg-white: hsl(0deg 0% 100%);
	--bg-black-alpha-20: hsl(0deg 0% 0% / 20%);
	--bg-lavender-blush: hsl(0deg 100% 98%);
	--bg-majorelle-blue: hsl(249deg 95% 63%);
	--bg-ocean-blue: hsl(249deg 63% 54%);
	--bg-majorelle-blue-alpha-5: hsl(249deg 95% 63% / 5%);
	--bg-misty-rose: hsl(0deg 100% 95%);
	--bg-red-salsa: hsl(357deg 94% 63%);
	--bg-red-salsa-alpha-5: hsl(357deg 94% 63% / 5%);
	--bg-english-vermillion: hsl(357deg 64% 53%);
	--bg-chrome-yellow-alpha-5: hsl(40deg 100% 50% / 5%);
	--bg-sunglow-alpha-10: hsl(48deg 100% 50% / 10%);
	--bg-gainsboro: hsl(0deg 0% 85%);

	/* text colors */
	--text-white: hsl(0deg 0% 100%);
	--text-gunmetal: hsl(209deg 40% 14%);
	--text-light-coral: hsl(357deg 96% 73%);
	--text-granite-gray: hsl(210deg 4% 38%);
	--text-majorelle-blue: hsl(249deg 95% 63%);
	--text-sunglow: hsl(48deg 100% 50%);

	/* border colors */
	--border-gainsboro: hsl(0deg 1% 85%);

	/* typography */
	--ff-poppins: 'Poppins', sans-serif;
	--fs-1: 4.2rem;
	--fs-2: 3.6rem;
	--fs-3: 2.5rem;
	--fs-4: 2.4rem;
	--fs-5: 2rem;
	--fs-6: 1.6rem;
	--fs-7: 1.5rem;
	--fw-bold: 700;
	--fw-semi-bold: 600;
	--fw-medium: 500;

	@media (min-width: 1200px) {
		--fs-1: 6.4rem;
		--fs-2: 4.8rem;
		--fs-3: 3rem;
	}

	/* spacing */
	--section-spacing: 80px;

	/* shadow */
	--shadow-1: 0 2px 10px hsl(209deg 40% 14% / 10%);
	--shadow-2: 0 5px 10px hsl(249deg 95% 63% / 25%);
	--shadow-3: 0 5px 10px hsl(357deg 64% 53% / 25%);
	--shadow-4: 0 30px 50px hsl(357deg 64% 53% / 30%);

	/* radius */
	--radius-pill: 200px;
	--radius-circle: 50%;
	--radius-30: 30px;
	--radius-20: 20px;

	/* transition */
	--transition-1: 250ms ease;
	--transition-2: 500ms ease;
	--cubic-out: cubic-bezier(0.05, 0.83, 0.52, 0.97);
}
